﻿@using HTNResp.Model
<div class="row wrapper wrapper-content">
    <div class="ibox float-e-margins">
        <div class="ibox-title">
            <h5>输入框提示</h5>
            <div class="ibox-tools">
            <a class="btn btn-xs btn-primary" onclick="filter='';table.ajax.reload();">刷新</a>
                <a class="btn btn-xs btn-primary" onclick="addModelShow()">新建</a>
                <a class="btn btn-xs btn-primary" onclick="searchModelShow()">查询</a>
            </div>

             <div>
            <p id="s"></p>
           </div>
        </div>
        <div class="ibox-content">
            <table id="data_table" class="table table-bordered">
                <thead>
                    <tr>
                        <th style="width:25%">标题</th>
                        <th style="width:40%">说明</th>
                        <th style="width:20%">控件类型</th>
                        <th style="width:15%">操作</th>
                    </tr>
                </thead>
                <tbody></tbody>
            </table>
        </div>
    </div>
</div>
<div class="modal inmodal fade" id="model_add" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title">
                    新建</h4>
            </div>
            <div class="modal-body">
                <form id="frm_add" class="form-horizontal">
                    <div class="form-group">
                        <label class="col-sm-2 control-label">控件名称</label>
                        <div class="col-sm-10"><input type="text" name="ControlName" class="form-control"required></div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">标题</label>
                        <div class="col-sm-10"><input type="text" name="Title" class="form-control"required></div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">说明</label>
                        <div class="col-sm-10"><textarea style="resize:none;overflow:auto" rows="3" type="text" name="Remark" class="form-control" required></textarea></div>
                    </div>
                    <div class="form-group">
                    <label class="col-sm-2 control-label">控件类型</label>
                    <div class="col-sm-10">
                    <select class="form-control"name="ControlType"required>
                   <option></option>
                   <option>input</option>
                   <option>checkbox</option>                
                   </select>
                     </div>
                     </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
                <button type="button" id="btn_add"class="btn btn-primary" onclick="addSubmit()">保存</button> 
            </div>
        </div>
    </div>
</div>

<div class="modal inmodal fade" id="model_update" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title">
                    修改</h4>
            </div>
            <div class="modal-body">
                <form id="frm_update" class="form-horizontal">                
                <div class="form-group">
                <label class="col-sm-2 control-label"></label>
                        <div class="col-sm-10"><input id="update_controlname" type="hidden" name="ControlName" class="form-control" /></div>
                    </div>
                   
                    <div class="form-group">
                        <label class="col-sm-2 control-label">标题</label>
                        <div class="col-sm-10"><input id="update_title"type="text" name="Title" class="form-control"required></div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">说明</label>
                        <div class="col-sm-10"><textarea style="resize:none;overflow:auto" rows="3" id="update_remark"type="textarea" name="Remark" class="form-control"required></textarea></div>
                    </div>
                    <div class="form-group">
                    <label class="col-sm-2 control-label">控件类型</label>
                    <div class="col-sm-10">
                    <select class="form-control"name="ControlType" id="update_controltype"required>
                   <option></option>
                   <option>input</option>
                   <option>checkbox</option>                
                   </select>
                     </div>
                     </div>
                    
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" id="btn_modify" onclick="updateSubmit()">修改</button> 
            </div>
        </div>
    </div>
</div>


  <div class="modal inmodal fade" id="model_search" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title">
                    查询</h4>
                </div>       
                <div class="modal-body">
                <form id="frm_search" class="form-horizontal">
                   <div class="form-group">
                    <label class="col-sm-2 control-label">标题</label>
                    <div class="col-sm-10"><input type="text" name="Title" class="form-control"></div>
                    </div>   
                                                                   
                     <div class="form-group">
                        <label class="col-sm-2 control-label">说明</label>
                        <div class="col-sm-10"><textarea style="resize:none;overflow:auto" rows=3 type="text" name="Remark" class="form-control"></textarea></div>
                    </div>

                      <div class="form-group">
                    <label class="col-sm-2 control-label">控件类型</label>
                    <div class="col-sm-10">
                    <select class="form-control"name="ControlType" id="search_symptomtype">
                   <option></option>
                   <option>input</option>
                   <option>checkbox</option>                
                   </select>
                     </div>
                     </div>
                                  
                <div class="modal-footer">
             <button type="button" class="btn btn-white"onclick="searchSubmit()">查询</button> 
                </div>
            </form>

          </div>
    </div>
  </div>
   </div>

@section script {
<script>
    var filter = " ";
    var table = null;
    $.extend($.validator.messages, { required: '该项不能为空！' });
    $(document).ready(function () {
        table = $("#data_table").DataTable({
            "pageLength": 10,
            "lengthChange": false,
            "processing": true,
            "serverSide": true,
            "ordering": false,
            "dom": '<"html5buttons"B>Tgitp',
            "ajax": function (tdata, callback, settings) {
                $.ajax({
                    type: "POST",
                    url: "/ControlContent/AjaxList" + filter,
                    cache: false,
                    data: tdata,
                    dataType: "json",
                    success: function (res) {
                        if (res.result == 0) {
                            toastr.warning(res.msg);
                        } else if (res.result == 100) {
                            location.href = "/Home/Index";
                        } else if (res.result == 300) {
                            location.href = "/Home/Illegal";
                        } else {
                            callback(res.data);
                        }
                    },
                    error: function (XMLHttpRequest, txtStatus, errorThrown) {
                        toastr.warning('查询失败，请重试');
                    }
                });
            },
            "columns": [
            // { data: "ControlName" },
                    {data: "Title" },
                    { data: "Remark",
                        "render": function (data, type, row) {
                            var html;
                            html = "<div style='height:50px;overflow:auto'>" + data + "</div>";
                            return html;
                        }
                    },
                    { data: "ControlType" },
                    {
                        data: "ControlName",
                        "render": function (data, type, row) {
                            var html;
                            html = "<a class='btn btn-xs btn-primary'onclick='updateModelShow(\"" + data + "\")'>修改</a>";
                            html += "&nbsp;<a class='btn btn-xs btn-danger'onclick='deleteModelShow(\"" + data + "\")'>删除</a>";
                            return html;
                        }
                    }
                ],
            "language": {
                "sProcessing": "处理中...",
                "sLengthMenu": "每页显示 _MENU_ 项结果",
                "sZeroRecords": "没有匹配结果",
                "sInfo": "当前显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",
                "sInfoEmpty": "当前显示第 0 至 0 项结果，共 0 项",
                "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
                "sInfoPostFix": "",
                "sSearch": "关键字搜索:",
                "sUrl": "",
                "sEmptyTable": "表中数据为空",
                "sLoadingRecords": "载入中...",
                "sInfoThousands": ",",
                "oPaginate": {
                    "sFirst": "首页",
                    "sPrevious": "上页",
                    "sNext": "下页",
                    "sLast": "末页"
                },
                "oAria": {
                    "sSortAscending": ": 以升序排列此列",
                    "sSortDescending": ": 以降序排列此列"
                }
            },
            "buttons": []

        })
        $("#frm_create").validate({});
        $("#frm_update").validate({});
    });

    function addModelShow() {
        $("#model_add").modal('show');
    }
    var btn_add = $('#btn_add').ladda();
    btn_add.click(function () {
        if (!$("#frm_add").valid()) {
            toastr.error("新建失败");
            return false;
        }
        btn_add.ladda('start');
        $.post("/ControlContent/Add", $("#frm_add").serialize(), function (res) {
            btn_add.ladda('stop');
            if (res.result == 1) {
                table.ajax.reload();
                $("#model_add").modal('hide');
                toastr.success("新建成功!");
                $("#model_add").on("hidden.bs.modal", function () {
                    $("input,select").val("");
                });
            } else if (res.result == 100) {
                location.href = "/Home/Index";
            } else if (res.result == 300) {
                location.href = "/Home/Illegal";
            } else {
                toastr.warning("增加失败");
            }
        })
    });
    function searchModelShow() {
        $("#model_search").modal('show');

    }

    function searchSubmit() {

        filter = "?" + $("#frm_search").serialize();

        table.ajax.reload();
        $("#model_search").modal('hide');
    }

    function deleteModelShow(ControlName) {
        swal({
            title: "确定删除吗?",
            text: "删除后不可找回!",
            type: "warning",
            showCancelButton: true,
            cancelButtonText: "取消",
            confirmButtonColor: "#DD6B55",
            confirmButtonText: "确认",
            closeOnConfirm: false
        }, function () {
            //表单提交
            $.post("/ControlContent/Remove?ControlName=" + ControlName, null, function (res) {
                if (res.result == 0) {
                    swal("删除失败!", "没用可供删除的数据", "error");
                }
                else if (res.result == 100) {
                    location.href = "/Home/Index";
                } else if (res.result == 300) {
                    location.href = "/Home/Illegal";
                } else {
                    table.ajax.reload();
                    swal("已删除!", "此条信息已从数据库中移除", "success");
                }
            })

        });

    }


    


    function updateModelShow(cn) {
        $.post("/ControlContent/Info?controlName=" + cn, null, function (res) {
            if (res.result == 0) {
                toastr.error("所选择项不存在,请刷新后重试");
            }
            else if (res.result == 100) {
                location.href = "/Home/Index";
            } else if (res.result == 300) {
                location.href = "/Home/Illegal";
            } else {
                $("#update_controlname").val(res.data.ControlName);
                $("#update_title").val(res.data.Title);
                $("#update_remark").val(res.data.Remark);
                $("#update_controltype").val(res.data.ControlType);
            }
        });
        $("#model_update").modal('show');
    }

    var btn_modify = $('#btn_modify').ladda();
    btn_modify.click(function () {
        if (!$("#frm_update").valid()) {
            toastr.error("修改失败");
            return false;
        }
        btn_modify.ladda('start');
        $.post("/ControlContent/Update", $("#frm_update").serialize(), function (res) {
            btn_modify.ladda('stop');
            if (res.result == 1) {
                table.ajax.reload();
                $("#model_update").modal('hide');
                toastr.success("修改成功!");
                $("#model_update").on("hidden.bs.modal", function () {
                    $("input,select").val("");
                });
            } else if (res.result == 100) {
                location.href = "/Home/Index";
            } else if (res.result == 300) {
                location.href = "/Home/Illegal";
            } else {
                toastr.warning("修改失败");
            }
        })
    });

    </script>
}